<template>
    <div class="detail-contain">
        <!-- <div class="header bg-grey">
            <div class="header-left">
                <div class="back" @click="handleReturn">
                    <i class="i-left"></i>
                </div>
            </div>
            <div class="header-middle m-l-12"><span class="font-black">我的订单</span></div>
            <div class="header-right">
                
            </div>
        </div> -->
        <div class="order-detail">
            <!--<div class="order-detail__logistics">你的订单正在发货,请耐心等待</div>-->
            <!--<div class="order-detail__logistics">中通快递，快递单号：6523698521452354</div>-->
            <div class="order-detail__address">
                <div class="address__header">
                    <i class="address__i"></i>
                    <div class="address__content">
                        <div class="address__user">{{address.name}}: <span class="phone">{{address.mobile}}</span></div>
                        <div class="address__detail">{{address.detail}}</div>
                    </div>
                </div>
            </div>
            <div class="order-detail__goods">
                <div class="goods__header">
                    <span class="header-item"><span class="title">莲蕊珠宝</span> <img src="../../assets/images/i-right.png"/></span>
                    <!--<span class="header-item">共{{orderInfo.goodsCount}}件</span>-->
                </div>
                <!--<router-link :to="'/detail/'+val.goods_id">-->
                <div class="goods__contain" v-for="val in goodsList">
                    <div class="goods__thumb"><img v-lazy="imageShow(val.list_pic_url)"></div>
                    <div class="goods__content">
                        <div>
                            <div class="goods__title">商品名称:</div>
                            <div class="goods__desc">{{val.goods_name}}</div>
                        </div>
                        <div class="goods__price">¥ {{val.retail_price}}</div>
                    </div>
                </div>
                <!--</router-link>-->
            </div>
            <div class="order-detail__info">
                <div class="info-item"><span>订单编号:</span><span>{{orderInfo.order_sn}}</span></div>
                <div class="info-item"><span>下单时间:</span><span>{{orderInfo.add_time}}</span></div>
                <div class="info-item"><span>支付方式:</span><span>在线支付</span></div>
            </div>
            <div class="order-detail__price">
                <div class="price-item"><span>商品金额</span><span>{{orderInfo.all_price}}</span></div>
                <div class="price-item">实付：<span class="price">￥{{orderInfo.all_price}}</span></div>
            </div>
        </div>
        <div class="order-detail__bottom">
            <!--<span><button class="btn"  @click="handleDeleteOrder(val.id)">删除订单</button></span>-->
            <span><button class="btn btn-red" @click="handleBuy(goodsList[0].goods_id)">再次购买</button></span>
        </div>
    </div>
</template>

<script>
import { autoLogin } from '@/utils'    
import { getOrderDetail } from "@/api/goods"

export default {
    name: "order-detail",
    data(){
        return {
            order_id: '',
            goodsList: [],
            orderInfo: [],
            address: {},
            Logistics:[]
        }
    },
    created(){
        autoLogin()
        this.order_id = this.$route.params.orderId
        this.getDetail()
    },
    methods:{
        handleReturn() {
            
        },
        getDetail(){
            const data = {}
            data.orderId  = this.order_id
            getOrderDetail(data).then(response=>{
                if(response.data){
                    if(response.data.orderGoods){
                        this.goodsList = response.data.orderGoods
                    }
                    if(response.data.orderInfo){
                        this.orderInfo = response.data.orderInfo
                        if(response.data.orderInfo.address){
                            this.address.name = response.data.orderInfo.consignee
                            this.address.mobile = response.data.orderInfo.mobile
                            this.address.detail = response.data.orderInfo.province + response.data.orderInfo.city + response.data.orderInfo.district + response.data.orderInfo.streetName +response.data.orderInfo.address
                        }
                    }
                    if(response.data.orderGoods){
                        this.goodsList = response.data.orderGoods
                    }
                }
            })
        },
        imageShow(src){
            const img = {}
            img.loading = require('@/assets/images/loading.gif');
            img.src = src;
            return img
        },
        // handleDeleteOrder(orderid){
        //     Dialog.confirm({
        //         title: '删除订单',
        //         message: '确定要删除该订单？'
        //     }).then(() => {
        //         const data = {}
        //         data.orderId = orderid
        //         orderCancel(data).then(respone=>{
        //             if(respone.errno===0){
        //                 Dialog.alert({
        //                     title: "",
        //                     message: "删除成功"
        //                 }).then(() => {
        //                     this.$router.go(0)
        //                 })
        //             }
        //         })
        //     }).catch(() => {
        //         // on cancel
        //     });
        //
        // },
        handleBuy(goodid){
            this.$router.push("/detail/"+goodid)
        },
        handleBack(){
            this.$router.push('/user/order')
        }
    }
}
</script>